<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>我的客户</title>
		<meta content="width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=0" name="viewport" />
		<meta content="yes" name="apple-mobile-web-app-capable" />
		<meta content="black" name="apple-mobile-web-app-status-bar-style" />
		<meta content="telephone=no" name="format-detection" />
		<!-- 引入YDUI样式 -->
		<link rel="stylesheet" href="../build/css/ydui.css" />
		<link rel="stylesheet" href="../css/common.css" />
		<link rel="stylesheet" href="../css/fontcss/css/font-awesome.min.css" />
		<style>
			.tab-nav-item.tab-active{
				color:#C1060F
			}
			.item-list{
				padding: .2rem;
			}
			.item-list li{
				padding: .025rem;
				color:#A1A1A1
			}
			
			.item-list li input{
				border: 0;
				color:#A1A1A1
			}
			.item-list li span{
				float: right;
				color: #C1060F;
				font-size: .2rem;
			}
			.item-list li.name input{
				font-size: .3rem; color:#000; margin-bottom: .1rem; font-family: initial;
			}
			span.nocash{
				color:green !important;
			}
			.plan input{
				overflow: hidden;
				text-overflow:ellipsis;
				white-space: nowrap;
			}
			.g-scrollview:after{
				height: 0;
			}
		</style>
	</head>
	<body>
		<section class="g-flexview" id="J_List"  >
		<div class="logincantion" >			
			<header class="m-navbar ">
				<a href="#" onClick="javascript :window.history.back(); return false;" class="navbar-item">
					<i class="back-ico"></i>
				</a>
				<div class="navbar-center">
					<span class="navbar-title">我的客户</span>
				</div>
			</header>
			<div class="m-tab" data-ydui-tab><!-- 这里添加data-ydui-tab就可以啦 -->
				<ul class="tab-nav">
					<li class="tab-nav-item tab-active" data-state="1"><a href="javascript:;">已报备</a></li>
					<li class="tab-nav-item" data-state="2"><a href="javascript:;">已到访</a></li>
					<li class="tab-nav-item" data-state="3"><a href="javascript:;">已成交</a></li>
					<li class="tab-nav-item" data-state="4"><a href="javascript:;">已结佣</a></li>
				</ul>
				<div class="tab-panel" ></div>											
			</div>			
		</div>
			
			
		<!-- 报备客户按钮 -->
		<a href="reportecustomers/homebaobei.html">
			<div id="preparation">报备</div>
		</a>
		</section>
	</body>
	<script src="../js/jq331.min.js"></script>
	<script src="../build/js/ydui.flexible.js"></script>
	<!-- 引入YDUI脚本 -->
	<script src="../build/js/ydui.js"></script>
	<script src="../js/template.js"></script>
	<script src="../js/DataLazyLoad.js"></script>
	<script src="../js/dropload.js"></script>
	<script src="../js/common.js"></script>
	<script id="yibaobei" type="text/html">
		{{each data as value index}}
			{{if data[index].id}}
				<a href='./customerinfo.html?id={{data[index].id}}'>
					<div id="baobeiLIst" class="infolist" data-id="{{data[index].id}}" >
						<div class="item-list">
							<ul>
								<li class="name">
								<input class="name" value="{{data[index].name}}" name="" readonly="readonly"></input>
								{{if data[index].is_pay!=null }}
									{{if data[index].is_pay== '1'}}
									<span style="color:green;">结佣</span>
									{{else}}
									<span>未结佣</span>
									{{/if}}
								{{/if}}
								</li>
								<li class="houseplace"><label>楼盘：</label><input value="{{data[index].house_title}}" name="" readonly="readonly"></input></li>
								<li class="tel"><label>手机：</label><input value="{{data[index].number}}" name="" readonly="readonly"></input></li>
								<li class="plan"><label>意向：</label><input value="{{data[index].content}}" name="" readonly="readonly"></input><span><a style="float:right;">{{data[index].date}}</a></span></li>
							</ul>
						</div>
					</div>
				</a>
			{{/if}}
		{{/each}}
	</script>
	<script>
		$(document).ready(function(){
			var mycustomerApi = commapi + "order/baobei";
			if(!dataToken){
				!function (win, $) {
					var dialog = win.YDUI.dialog;													
					dialog.confirm('系统提示', '您还没有登录，现在去登录...', [
						{
							txt: '取消',
							color: false, /* false:黑色  true:绿色 或 使用颜色值 */
							callback: function () {
								history.go(-1);
							}
						},
						{
							txt: '确定',
							color: true,
							callback: function () {
								location.href="./login.html";
							}
						}
					]);
				}(window, jQuery);					
				return;
			}
			//token判断时效，超时退出登录
			var _interval_handler=-1;
			
			var _EXPIRE_TIME = datamoretime;//判断时效时间，则注销
			//var _EXPIRE_TIME = 10000;
			(function () {
				if (dataToken) {//已登录
				//刷新最后使用时间
				localStorage.setItem("nxgx_lastVisitTime", new Date().getTime());
				_interval_handler=setInterval(checkExpired, 10*1000);//10秒钟检查一次，是否超时	
				
				//获取已报备列表
				getbestnewList(1) 			
				}
			})();
			
			function checkExpired() {
			//console.log("10秒检查一次是否过期"+window.location.href+"::"+new Date());
			var storeLastTime=localStorage.getItem("nxgx_lastVisitTime")?localStorage.getItem("nxgx_lastVisitTime"):-1;
			if (storeLastTime==-1) clearInterval(_interval_handler);
			else {
					if ((new Date()).getTime()-storeLastTime>_EXPIRE_TIME) {  //过期了
					!function (win, $) {
						var dialog = win.YDUI.dialog;
						/* 加载中提示框 */									
							dialog.loading.open('登录超时...');
							setTimeout(function () {
								dialog.loading.close();/* 移除loading */
								localStorage.removeItem('token'); //清除token
								location.href="./login.html";
							}, 2000);
					
					}(window, jQuery);	
					clearInterval(_interval_handler);
					}
				}
			};		
			
			function getbestnewList (state) {					
				$(".tab-panel").html('');
				var page = 1, pageSize = 10;
					$.ajax({
						url: mycustomerApi,
						type: 'GET',									
						data: { 'page': page, 'limit':pageSize, 'state': state},								
						beforeSend: function(request) {
									request.setRequestHeader("token", dataToken);
								},
						success: function (ret) {							
							var html = template('yibaobei', {data: ret});
							$('.tab-panel').append(html);
						}
					});
																			
			}
			
			$('.tab-nav li').click(function(){
				var status = $(this).data('state');
				$('.tab-nav li').removeClass('tab-active');
				$(this).addClass('tab-active');
				getbestnewList(status) //点击显示不同状态的列表信息
			});										
		})
	</script>
</html>
